import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  ScrollView,
  Image,
  Animated,
  WebView
} from 'react-native';
import styles from './indexStyle';
import api from '../../services/api';
import ToastTip from '../global/ToastTip';
import LoadingTip from '../global/LoadingTip';
import * as config from '../../constants/apiConfig';

class AgreeWebView extends Component {
    constructor(props) {
		super(props);

		this.state = {
            loadingShow: false,
		};

		// this._getTabHeight = this._getTabHeight.bind(this);
		// this._onChangeTab = this._onChangeTab.bind(this);

		// this.props.navigator.setOnNavigatorEvent(this._onNavigatorEvent.bind(this));
	}

    _onLoadStart(){
        this.setState({loadingShow: true});
    }
    _onLoadEnd(){
        this.setState({loadingShow: false});
    }

    componentWillMount() {
		// this._retrieveDetails();
	}

    render() {
        return (
            <View style={styles.container}>
                <WebView
                    style={{flex:1}}
                    source={{uri:config.WEB_BASE_URL + "/app-protocol"}}
                    onLoadStart={this._onLoadStart.bind(this)}
                    javaScriptEnabled={true}
                    onLoadEnd={this._onLoadEnd.bind(this)}
                    userAgent={"housekeeper"}
                />
                <LoadingTip show={this.state.loadingShow}/>
            </View>
        );
    }
}

var connectHelper = require('../../services/connectHelper');
AgreeWebView = connectHelper(state => state)(AgreeWebView);

module.exports = AgreeWebView;
